import type { Directive, App } from 'vue'
import { isAuth } from '@/utils/directives/auth/userAuth'

/**
 * 按钮权限指令
 */
export const hasAuth: Directive = {
  mounted (el: HTMLElement, binding) {
    const { value } = binding
    if (!value) return
    if (value) {
      const isHasPerm = isAuth(value)
      if (!isHasPerm) {
        // el.style.display = 'none'
        el.parentNode && el.parentNode.removeChild(el)
      }
    } else {
      throw new Error(
        "need perms! Like v-auth=\"['sys:user:add','sys:user:edit']\""
      )
    }
  }
}

export function setupAuthDirective (app: App) {
  app.directive('auth', hasAuth)
}
